<template>
	<el-dialog v-model="props.show" width="670" close-icon="CloseBold" @close="close">
		<template #header>
			<div class="text-#000000 font-bold text-18px">
				账户入金
			</div>
		</template>
		<template #default>
			<div class="mt-20px">
				<p class="text-#86909C text-14px mb-10px">欧神支持多种入金方式，选择最适合您的方式</p>
				<template v-for="(item, index) in dataList" :key="index">
					<div class="flex items-center p-20px cursor-pointer border-1px border-dashed rounded-8px mb-20px
					border-#E5E6EB"
					>
						<div class="mr-20px">
							<img :src="item.icon" alt=""
							class="w-44px h-44px">
						</div>
						<div>
							<p class="text-#20232A text-18px mb-6px">{{ item.title }}</p>
							<p class="text-#86909C text-14px">{{ item.content }}</p>
						</div>
					</div>
				</template>
			</div>
		</template>
	</el-dialog>
</template>
<script setup lang="ts">
interface IProps {
	show: boolean;
}

const props = defineProps<IProps>();
const emit = defineEmits(['close']);

const close = () => {
	emit('close', false);
}

const dataList = ref<any[]>([
	{
		title:'C2C交易',
		content:'点对点交易，价格从优，支持多种本地支付方式。',
		icon:'/transaction/exchange/add-dialog1.svg'
	},
	{
		title:'数字货币充值',
		content:'向您的欧神账户充值数字货币',
		icon:'/transaction/exchange/add-dialog2.svg'
	},
	{
		title:'通过欧神支付接收加密货币',
		content:'0手续费通过其他欧神用户的欧神支付ID或二维码接收货币。',
		icon:'/transaction/exchange/add-dialog2.svg'
	}
])

</script>
<style lang="scss" scoped></style>
